<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/view/common/kendocommon.jsp"%>
<!DOCTYPE html>
<html>
<head>
    <title>用户列表</title>
    <meta charset="utf-8">
    <style>
    	table{font-size:12px}
    	.user-img {
            width: 80px;
            height: 80px;
            border: 1px none #ccc;
            overflow: hidden;
        }

            .user-img img {
                border: none;
                width: 100%;
            }
    </style>
    <script>
    var selectItem=new Object();
    var searchItem=new Object();
    var admission_way=new Object();
        $(document).ready(function() {
        	
        	$(".various").fancybox({
        		maxWidth	: 1000,
        		maxHeight	: 700,
        		fitToView	: false,
        		width		: '80%',
        		height		: '80%',
        		autoSize	: false,
        		closeClick	: false,
        		openEffect	: 'none',
        		closeEffect	: 'none'
        	});
        	
        	$("#toolbar").kendoToolBar({
	            resizable: false,
	            items: [
	            	{ type: "separator" },

	                { template: '<label>手机号:</label><input id="phone" class="k-textbox"/>'},
	                { template: '<label>名字:</label><input id="real_name" class="k-textbox" style="width:120px"/>'},
	                { template: '<label>身份证:</label><input id="identity_card" class="k-textbox" style="width:120px"/>'},
	                { type: "button", text: "查询",click: queryCustomerList }
	            ]
	        });

	        //客户列表数据源
            customerDS = new kendo.data.DataSource({
                transport: {
                    read:  {
                        url: "${path}/assist/getUsersList",
                        dataType: "json",
                        data: function() {
					        return {
					        	phone:$("#phone").val(),
					        	real_name:$("#real_name").val(),
					         	identity_card:$("#identity_card").val()
					        };
					    }
                    }
                },
                serverPaging: true,
                serverFiltering: true,
                pageSize: 7,
                schema: {
                	data:"data",
               		total:"total"
                },
                group: [{field: "family_name",title: "家庭名称"}]
            });

            //查询客户信息
      		var queryCustomer = function(dataItem){
      			return "<a href='${path}/assist/getUsersList?c_user_id="+dataItem.c_user_id+"' style='color:#000' class='various' data-fancybox-type='iframe' title='会员信息'>" + dataItem.real_name + "</a>";
      		};
           
            //客户列表
            $("#customergrid").kendoGrid({
                dataSource: customerDS,
                pageable: {
					refresh: true,
					pageSizes: true,
					buttonCount: 5,
					page: 1,
					pageSize: 7,
					pageSizes: [7, 10,15],
					messages: {
						display: "显示 {0}-{1} 共 {2} 项",
						empty: "没有数据",
						itemsPerPage: "每面显示数量",
						first: "第一页",
						last: "最后一页",
						next: "下一页",
						previous: "上一页"
					}
				},
                selectable: "multiple row",
                allowCopy: true,
                groupable : {
					messages : {
						empty : "将列拖拽到此处进行分类查看"
					}
				},
				
                //editable: 'incell',
                columns: [
                    { field:"real_name", title: "客户姓名",width: "80px"},
                    { field:"sex", title: "性别",width: "50px",editable: false},                   
                    { field:"role_name", title: "角色",width: "50px",editable: false}, 
                    
                    { field:"member_name", title: "家庭称谓",width: "80px",editable: false},
                    
                    { field:"phone", title: "手机号",width: "120px",editable: false},
                   	{field: "family_name",title: "家庭名称",width: "150px",editable: false},
                    
                    { field:"photo_src",  title: "头像",width: "80px", template:photoFun,editable: false},
                    { field:"finger_hash",  title: "是否已录指纹",width: "100px",editable: false},
                    
                    { field:"identity_card", title: "身份证号",width: "150px",editable: false},
                    { field:"email", title: "邮箱",width: "200px",editable: false},
                    { command: [{name:"updatePhoto",text:"<span class='comm'>修改头像</span>",click:addAvatar},
                                {name:"updateFinger",text:"<span class='comm'>修改指纹</span>",click:updateFinger}], 
                        attributes:{style:"text-align:center"},headerAttributes:{style:"text-align:center"},title: "操作", width: "200px" }]
            });            
            
            $('#check-all').change(function(){
            	var customergrid = $("#customergrid").data("kendoGrid");
            	$.each(customergrid.items(), function (i, item) {
					var cbxController = $(item).find(".gridchk");
					var isChecked = cbxController.is(":checked");
					if(isChecked){
						cbxController.prop("checked",false); 
					}else{
						cbxController.prop("checked",true); 
					}
				});
            });
            

                 
		});
		
		var updateFinger = function(e){
			var grid = $("#customergrid").data("kendoGrid");
			var data = grid.dataItem($(e.currentTarget).closest("tr"));
			
			window.location.href='DibaboWM:sendmsg?userid='+data.c_user_id+'&matchtype=1';
			
		}
		
		var photoFun = function(dataItem){
	 		if(dataItem.photo_src==null){
	 			return "";
	 		}else{
				return "<div class='user-img'><img  height='78' width='78' src='"+dataItem.photo_src+"@78w_78h_2e'/></div>";	 			
	 		}

		}
        
		
		var queryCustomerList = function(e){//查询
			var customergrid = $("#customergrid").data("kendoGrid");
			$("#customergrid").data("kendoGrid").dataSource.fetch();
			$("#customergrid").data("kendoGrid").dataSource.page(1);
		}

		
		var addAvatar=function(e){
			
			var grid = $("#customergrid").data("kendoGrid");
			var data = grid.dataItem($(e.currentTarget).closest("tr"));
			
			//var element=$("<div id='dialog'></div>");
			
			$('#p').append("<div id='dialog'></div>");
/* 			layIndex = layer.open({
				title:"添加头像",
				type: 2,
				fix: false,
		        //shadeClose: true,
		        maxmin: true,
				area: ['800px', '400px'], //宽高
			    content: "${path}/assist/avatar?c_user_id="+data.c_user_id,
			}); */
			
			 $("#dialog").kendoWindow({
					visible: true,
					content: "${path}/assist/avatar?c_user_id="+data.c_user_id,
					iframe: true,
					actions: ["Minimize", "Maximize","Close" ],
					height: "350px",
					width:"800px",
					position: {
					    top: "25%", 
					    left: "25%"
					  },
					close: function(e) {
					//	window.location.reload();
						var dialog = $("#dialog").data("kendoWindow");
						dialog.destroy();
					}
				});
			
		}
		
		var successUpdate=function(){
			var dialog = $("#dialog").data("kendoWindow");
			dialog.destroy();
			//layer.close(layIndex);
			$("#customergrid").data("kendoGrid").dataSource.fetch();
		}

    </script>
</head>
<body>
	<div id="toolbar" style="margin:2px"></div>
    <div id="customergrid" style="margin:2px;font-size:10px"></div>
    
    <div style="display: none;">		
		<div id="inlineForm" style="width:700px;overflow:auto;">
			<table>
                <tr>
                    <td style="width:100px;padding:5px">
                        <span  style="width:90px">内容</span>
                    </td>
                    <td style="padding:5px">
                        <textarea name="note" id="note" style="width:495px;height:200px" class="k-textbox"></textarea>
                    </td>
                </tr>
            </table>
		</div>
	</div>
	 <div id="p"></div>
	<a href="${path}/assist/registerbyassist" class="fancybox fancybox.iframe" id="register" title="客户录入" style="display:none"></a>
</body>
</html>
